import React from 'react'
import { Routes, Route, Link } from 'react-router-dom'
import Home from './pages/Home'
import Login from './pages/Login'
// Routes用来包裹Route.并帮我们监听浏览器地址栏的变化
// Route 用来定义前端路由规则: 路径和组件的一一对应规则
// Link的作用: 帮我们渲染一个a标签,让用户可以点击.并且点击了之后,只会修改路径,不会发送请求
export default function App() {
  return (
    <div>
      <Link to="/home">首页</Link> &nbsp;&nbsp;
      <Link to="/login">登录页</Link>
      <hr />
      {/* 定义前端路由规则 */}
      <Routes>
        <Route path="/home" element={<Home></Home>}></Route>
        <Route path="/login" element={<Login></Login>}></Route>
      </Routes>
    </div>
  )
}
